Skip to main content

마크다운 기본 문법

마크다운이란 무엇인가 ?#

마크다운(markdown)은 일반 텍스트 문서의 양식을 편집하는 문법이다. README 파일이나 온라인 문서, 혹은 일반 텍스트 편집기로 문서 양식을 편집할 때 쓰인다. 마크다운을 이용해 작성된 문서는 쉽게 HTML 등 다른 문서형태로 변환이 가능하다.
-위키백과

이 문서도 마크다운 공부하면서 작성 중이다.

마크다운 사용법#

1. 제목(header)#

h1부터 h6 까지 # 의 개수로 표현할 수 있다.

예시 ✏️#

# h1## h2### h3#### h4##### h5###### h6

결과 💁🏼#

h1

h2#

h3#

h4#

h5#
h6#


2. 문단 간격#

<br /> 을 사용하여 문단을 나눌 수 있다.

예시 ✏️#

첫 번째 문단<br />두 번째 문단

결과 💁🏼#

첫 번째 문단


두 번째 문단

3. 목록 (리스트)#

3.1 순서를 표기하는 목록(리스트)#

숫자와 .을 이용한다.

예시 ✏️#

1. 첫 번째2. 두 번째3. 세 번째4. 네 번째

결과 💁🏼#

  1. 첫 번째
  2. 두 번째
  3. 세 번째
  4. 네 번째

3.2 순서를 표기하지 않는 목록(리스트)#

-, *, + 를 사용한다. (셋 다 동일하게 작성된다.)

예시 ✏️#

- 순서를 표기하지 않는 목록(리스트) 1    - 목록 1.1        - 목록 1.2
* 순서를 표기하지 않는 목록(리스트) 2    * 목록 2.1        * 목록 2.2
+ 순서를 표기하지 않는 목록(리스트) 3    + 목록 3.1        + 목록 3.2

결과 💁🏼#

  • 순서를 표기하지 않는 목록(리스트) 1

    • 목록 1.1
      • 목록 1.2

  • 순서를 표기하지 않는 목록(리스트) 2

    • 목록 2.1
      • 목록 2.2
  • 순서를 표기하지 않는 목록(리스트) 3
    • 목록 3.1
      • 목록 3.2


4. 폰트 스타일#

굵게, 기울이기, 취소선 을 사용하여 폰트 스타일을 나타낼 수 있다.

예시 ✏️#

__굵게__**굵게**_기울여 쓰기_*기울여 쓰기*~~취소선~~

결과 💁🏼#

굵게
굵게
기울여 쓰기
기울여 쓰기
취소선



5. 인용문#

>를 이용해서 인용문을 작성 할 수 있다. >의 개수가 많을 수록 중첩된다.

예시 ✏️#

> 인용문 입니다.>> 두 번째 인용문 입니다.>>> 세 번째 인용문 입니다.

결과 💁🏼#

인용문 입니다.

두 번째 인용문 입니다.

세 번째 인용문 입니다.



6. 인라인 코드#

백틱(` ) 을 사용하여 인라인 코드를 작성할 수 있다.

예시 ✏️#

`인라인 코드는 이렇게 작성한다.`

결과 💁🏼#

인라인 코드는 이렇게 작성한다.



7. 여러 줄로 된 코드 블럭#

백틱(` )을 세 개 사용해서 작성할 수 있다. (프로그래밍 언어도 설정 할 수 있다.)

예시 ✏️#

```위 아래 3개로 감싸면 블럭으로 만들 수 있다.```
```javascriptconst sumNumbers = (firstNum, lastNum) => firstNum + lastNum;sumNumbers(10, 20)```

결과 💁🏼#

위 아래 3개로 감싸면 블럭으로 만들 수 있다.
const sumNumbers = (firstNum, lastNum) => firstNum + lastNum;sumNumbers(10, 20);


8. 링크(Link)#

인라인 링크와 url 링크로 나타낼 수 있다.

예시 ✏️#

인라인 링크는 아래처럼[인라인 링크](https://ksmfou98.github.io/https://ksmfou98.github.io/)
url 링크는 아래처럼<https://ksmfou98.github.io/https://ksmfou98.github.io/>

결과 💁🏼#

인라인 링크는 아래처럼
인라인 링크

url 링크는 아래처럼
https://ksmfou98.github.io/https://ksmfou98.github.io/



9. 수평선#

*,이나 -, _ 등을 3개 이상 입력하면 된다. 또는 <hr /> 태그를 써도 된다.

예시 ✏️#

***---___<hr />

결과 💁🏼#



10. 이미지 삽입#

이미지는 ![이미지 설명](이미지 링크) 이렇게 삽입할 수 있다.

예시 ✏️#

![고양이](https://cdn.pixabay.com/photo/2019/03/13/08/29/cat-4052454_1280.jpg)

결과 💁🏼#

고양이



11. 테이블(Table)#

테이블은 아래와 같이 작성한다. | 로 구분하며, <4. 폰트 스타일> 에서 이야기 했던 기본적인 스타일 적용이 가능하다. 또한 -(하이픈)으로 구분된 곳 각각 왼쪽, 양쪽, 오른쪽에 :(콜론)을 붙일 경우 순서대로 왼쪽 정렬, 가운데 정렬, 오른쪽 정렬이 가능하다.

예시 ✏️#

| 드라마 제목 | 주연 배우 | 방영일 ||:----------|:----------:|----------:|| **호텔 델루나** | 이지은, 여진구 | ~~2019.07.13. ~ 2019.09.01.~~ || 타인은 지옥이다 | 임시완, 이동욱, 이현욱, 이정은 | 2019.08.31. ~ || 멜로가 체질 | 천우희, 안재홍, 전여빈, 공명 | 2019.08.09. ~ |

결과 💁🏼#

드라마 제목주연 배우방영일
호텔 델루나이지은, 여진구2019.07.13. ~ 2019.09.01.
타인은 지옥이다임시완, 이동욱, 이현욱, 이정은2019.08.31. ~
멜로가 체질천우희, 안재홍, 전여빈, 공명2019.08.09. ~


12. 체크 박스(Check Box)#

-, *, +뒤에 띄어쓰기 후 대괄호를 넣어 작성. 대괄호안에 띄어쓰기를 하면 빈 체크박스, x를 넣으면 체크된 체크박스가 생깁니다.

예시 ✏️#

- [ ] 운동 하기- [x] 강의 듣기

결과 💁🏼#

  • 운동 하기
  • 강의 듣기

마치며#

오늘 부터 블로그를 시작하기 위해서, facebook에서 만든 docusaurus를 이용해 블로그를 만들었다. 그래서 본격적으로 글을 쓰려고 하는데! 마크다운 문법을 몰라서 계속 검색하면서 해야했다. 차라리 이럴꺼면 그냥 첫 블로그 글을 마크다운으로 쓰면 되지 않을까 ? 해서 공부를 하면서 작성 했다. 앞으로 블로그 글을 쓸 때 이 내용을 엄청 참고 하면서 쓸 거 같다 ㅋㅋ